<!DOCTYPE html>
<html xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>淘贝管理系统</title>
    <script src="../asserts/dist/vue.js"></script>
    <script src="../asserts/dist/layui.js"></script>
    <script src="../asserts/js/jquery-2.1.1.min.js"></script>
    <link rel="stylesheet" type="text/css" href="../asserts/dist/css/layui.css" />
    <style>
        .option {
            display: none;
        }

    </style>
</head>
<body>
<div id="app">
    <div class="layui-layout layui-layout-admin">
        <div class="layui-header">
            <div class="layui-logo layui-hide-xs layui-bg-black">淘贝管理系统</div>
            <!-- 头部区域（可配合layui 已有的水平导航） -->
            <ul class="layui-nav layui-layout-right" >
                <li class="layui-nav-item layui-hide layui-show-md-inline-block" v-if="adminStatus == 1">
                    <a href="javascript:;">
                        <!--头像在这-->
                        <img src="//tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg"
                             class="layui-nav-img">
                        {{adminName}}
                    </a>
                    <dl class="layui-nav-child">
                        <dd @click="loginOut()"><a>退出登录</a> </dd>
                    </dl>
                </li>
                <li style="padding-top: 20px" v-else>
                    未登录，<a href="login.html" style="color: #c9302c">请先登录！</a>
                </li>
            </ul>

        </div>

        <!--左侧导航-->
        <div class="layui-side layui-bg-black">
            <div class="layui-side-scroll">
                <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
                <ul class="layui-nav layui-nav-tree" lay-filter="test">
                    <li class="layui-nav-item" @click="change('1-1')"><a href="#">用户管理</a></li>
                    <li class="layui-nav-item" @click="change('1-2')"><a href="#">商品管理</a></li>
                    <li class="layui-nav-item" @click="change('1-3')"><a href="#">订单管理</a></li>
                    <li class="layui-nav-item" @click="change('1-4')"><a href="#">优惠券管理</a></li>
                    <li class="layui-nav-item" @click="change('1-5')"><a href="#">店铺管理</a></li>
                </ul>
            </div>
        </div>
        <!-- 用户管理 -->
        <div class="layui-body option-active" id="1-1" style="margin-top: 10px; margin-left: 6%;">
            <div class="layui-input-block" style="margin-left: 0px;display: inline;">
                <input type="text" name="title" style="width: 120px; display: inline;" lay-verify="title"
                       autocomplete="off" placeholder="输入用户查询" class="layui-input" v-model="userInput">
            </div>
            <div style="display: inline;">
                <button type="button" class="layui-btn" style="height: 37px; margin-bottom: 3px;"
                        @click="queryUser()">查询</button>
            </div>
            <div style="width: 1400px;">
                <table class="layui-table">
                    <colgroup>
                        <col width="150">
                        <col width="60">
                        <col width="200">
                        <col width="200">
                        <col width="60">
                        <col width="200">
                        <col width="140">
                    </colgroup>
                    <thead>
                    <tr>
                        <th>昵称</th>
                        <th>性别</th>
                        <th>手机</th>
                        <th>邮箱</th>
                        <th>头像</th>
                        <th>余额</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="(item,index) in tableData">
                        <td>{{item.username}}</td>
                        <td>{{item.sex}}</td>
                        <td>{{item.tel}}</td>
                        <td>{{item.email}}</td>
                        <td><img v-bind:src="item.imgUrl" style="width: 60px;height: 60px" @click="updateImg(item)" :id="'img_'+item.id"></td>
                        <td>{{item.account}}</td>
                        <td>
                            <button type="button" class="layui-btn layui-btn-normal"
                                    @click="dialog(item)">修改</button>
                            <button type="button" class="layui-btn layui-btn-danger"
                                    @click="deleUser(item)">删除</button>
                        </td>
                    </tr>
                    </tbody>
                </table>
                <div style="padding-left: 500px;">
                    <div id="demo20"></div>
                    <ul id="biuuu_city_list"></ul>
                </div>
            </div>
            <input type="file" id="file_upload" value="文件上传" style="display: none">
        </div>
        <!-- 商品管理 -->
        <div class="layui-body option" id="1-2" style="margin-top: 10px; margin-left: 6%;">

            <div style="display: inline;">
                <div class="layui-input-inline">
                    <input type="text" name="title" style="width: 120px;" lay-verify="title"
                           autocomplete="off" placeholder="输入关键字" class="layui-input" v-model="productInfo">
                </div>
            </div>

            <div style="display: inline; ">
                <div class="layui-input-inline" style="width: 140px">
                    <form class="layui-form">
                        <div class="layui-input-inline" style="width: 130px;">
                            <select id="RiverTypeLevel" name="interest">
                                <option value="">选择商品类型</option>
                            </select>
                        </div>
                    </form>
                </div>
            </div>

            <div style="display: inline;">
                <div class="layui-input-inline" style="margin-left: -35px ; margin-top: 15px">
                    <form class="layui-form-item" >
                        <label class="layui-form-label">价格区间</label>
                        <div class="layui-input-inline" style="width: 100px;">
                            <input type="text" name="price_min" v-model="priceMin" placeholder="￥" autocomplete="off" class="layui-input">
                        </div>
                        <div class="layui-form-mid">-</div>
                        <div class="layui-input-inline" style="width: 100px;">
                            <input type="text" name="price_max"  v-model="priceMax" placeholder="￥" autocomplete="off" class="layui-input">
                        </div>
                    </form>
                </div>
            </div>
            <div style="display: inline;">
                <button type="button" class="layui-btn" style="height: 37px; margin-bottom: 1px; margin-left: -10px"
                        @click="queryProduct()">查询</button>
            </div>
            <div style="display: inline; padding-left: 20px">
                <button class="layui-btn" @click="chek()" style="height: 37px; margin-bottom: 3px; ">查看未审核商品<span class="layui-badge"  id="num">{{unreviewedNum}}</span></button>
            </div>
            <div style="width: 1400px;">
                <table class="layui-table">
                    <colgroup>
                        <col width="150">
                        <col width="250">
                        <col width="150">
                        <col width="150">
                        <col width="120">
                        <col width="80">
                        <col width="80">
                        <col width="260">
                    </colgroup>
                    <thead>
                    <tr>
                        <th>商品名</th>
                        <th>商品介绍</th>
                        <th>商品类型</th>
                        <th>商品价格</th>
                        <th>商品图片</th>
                        <th>销量</th>
                        <th>当前状态</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="(item,index) in tableData">
                        <td>{{item.name}}</td>
                        <td>{{item.context}}</td>
                        <td>{{item.tname}}</td>
                        <td>{{item.price}}</td>
                        <td><img v-bind:src="item.url"></td>
                        <td>{{item.sale}}</td>
                        <td>
                            <span v-if="item.flag == 1">在售</span>
                            <span v-else-if="item.flag == 2">已下架</span>
                            <span v-else>审核中</span>
                        </td>
                        <td>
                            <button type="button" class="layui-btn layui-btn-normal"
                                    @click="updateProductFlag(item,2)"  v-if="item.flag == 1">下架</button>
                            <button type="button" class="layui-btn layui-btn-normal"
                                    @click="updateProductFlag(item,3)"  v-if="item.flag == 1">返回审核</button>
                            <button type="button" class="layui-btn layui-btn-normal"
                                    @click="updateProductFlag(item,1)"  v-if="item.flag == 2">上架</button>
                            <button type="button" class="layui-btn layui-btn-normal"
                                    @click="updateProductFlag(item,3)"  v-if="item.flag == 2">返回审核</button>
                            <button type="button" class="layui-btn layui-btn-normal"
                                    @click="updateProductFlag(item,1)"  v-if="item.flag == 3">上架</button>
                            <button type="button" class="layui-btn layui-btn-normal"
                                    @click="updateProductFlag(item,2)"  v-if="item.flag == 3">下架</button>
                                <button type="button" class="layui-btn layui-btn-danger"
                                        @click="deleProduct(item)">删除</button>
                        </td>
                    </tr>
                    </tbody>
                </table>
                <div style="padding-left: 500px;">
                    <div id="demo10"></div>
                    <ul id="biuuu_city_list1"></ul>
                </div>
            </div>

        </div>
        <!-- 订单管理-->
        <div class="layui-body option" id="1-3" style="margin-top: 10px; margin-left: 6%;">
            <div class="layui-input-block" style="margin-left: 0px;display: inline;">
                <input type="text" name="title" style="width: 140px; display: inline;" lay-verify="title"
                       autocomplete="off" placeholder="输入订单编号查询" class="layui-input" v-model="orderInfo">
            </div>
            <div style="display: inline;">
                <button type="button" class="layui-btn" style="height: 37px; margin-bottom: 3px;"
                        @click="queryOrder()">查询</button>
            </div>
            <div style="width: 1400px;">
                <table class="layui-table">
                    <colgroup>
                        <col width="150">
                        <col width="150">
                        <col width="230">
                        <col width="130">
                        <col width="230">
                        <col width="80">
                        <col width="40">
                    </colgroup>
                    <thead>
                    <tr>
                        <th>订单编号</th>
                        <th>所属用户ID</th>
                        <th>收货地址</th>
                        <th>订单总金额</th>
                        <th>订单备注</th>
                        <th>是否有效</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="(item,index) in tableData">
                        <td>{{item.orderNumber}}</td>
                        <td>{{item.uid}}</td>
                        <td>{{item.address}}</td>
                        <td>{{item.totalPrice}}</td>
                        <td>{{item.remark}}</td>
                        <td v-if="(item.storeDelete + item.userDelete) == 0">否</td>
                        <td v-else>是</td>
                        <td>
                            <button type="button" class="layui-btn layui-btn-danger"
                                    @click="deleOrder(item)">删除</button>
                        </td>
                    </tr>
                    </tbody>
                </table>
                <div style="padding-left: 500px;">
                    <div id="demo30"></div>
                    <ul id="biuuu_city_list3"></ul>
                </div>
            </div>
        </div>
        <!-- 优惠券管理-->
        <div class="layui-body option" id="1-4" style="margin-top: 10px; margin-left: 6%;">
            <div class="layui-input-block" style="margin-left: 0px;display: inline; visibility:hidden;">
                <input type="text" name="title" style="width: 120px; display: inline;" lay-verify="title"
                       autocomplete="off" placeholder="输入用户查询" class="layui-input" v-model="userInput">
            </div>
            <div style="display: inline; visibility:hidden;">
                <button type="button" class="layui-btn" style="height: 37px; margin-bottom: 3px;"
                        @click="queryUser()">查询</button>
            </div>
            <div style="width: 1400px;">
                <table class="layui-table">
                    <colgroup>
                        <col width="170">
                        <col width="200">
                        <col width="320">
                        <col width="130">
                        <col width="60">
                        <col width="140">
                        <col width="120">
                    </colgroup>
                    <thead>
                    <tr>
                        <th>优惠券名称</th>
                        <th>发放店铺编号</th>
                        <th>发放数量</th>
                        <th>适用商品编号</th>
                        <th>发放日期</th>
                        <th>有效天数</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="(item,index) in tableData">
                        <td>{{item.name}}</td>
                        <td>{{item.sid}}</td>
                        <td>{{item.quantity}}</td>
                        <td>{{item.pid}}</td>
                        <td>{{item.releaseTime}}</td>
                        <td>{{item.validity}}</td>
                    </tr>
                    </tbody>
                </table>
                <div style="padding-left: 500px;">
                    <div id="demo40"></div>
                    <ul id="biuuu_city_list4"></ul>
                </div>
            </div>
        </div>
        <!-- 店铺管理-->
        <div class="layui-body option" id="1-5" style="margin-top: 10px; margin-left: 6%;">
            <div class="layui-input-block" style="margin-left: 0px;display: inline;">
                <input type="text" name="title" style="width: 120px; display: inline;" lay-verify="title"
                       autocomplete="off" placeholder="输入店铺名查询" class="layui-input" v-model="storeInput">
            </div>
            <div style="display: inline;">
                <button type="button" class="layui-btn" style="height: 37px; margin-bottom: 3px;"
                        @click="queryStore()">查询</button>
                <button type="button" class="layui-btn" style="height: 37px; margin-bottom: 3px;"
                        @click="queryStoreByFlag(0)">查询未审核</button>
            </div>
            <div style="width: 1400px;">
                <table class="layui-table">
                    <colgroup>
                        <col width="170">
                        <col width="200">
                        <col width="320">
                        <col width="130">
                        <col width="60">
                        <col width="110">
                        <col width="120">
                        <col width="200">
                    </colgroup>
                    <thead>
                    <tr>
                        <th>店铺名称</th>
                        <th>店铺简介</th>
                        <th>店铺地址</th>
                        <th>店铺资质</th>
                        <th>店铺照片</th>
                        <th>店铺等级</th>
                        <th>注册日期</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="(item,index) in tableData">
                        <td>{{item.name}}</td>
                        <td>{{item.info}}</td>
                        <td>{{item.address}}</td>
                        <td>{{item.account}}</td>
                        <td><img v-bind:src="item.imgUrl" style="width: 60px;height: 60px"></td>
                        <td>{{item.level}}</td>
                        <td>{{item.registerTime}}</td>
                        <td>
                            <button type="button" class="layui-btn layui-btn-normal"
                                    @click="updateStoreFlag(item)"  v-if="item.flag == 0">通过审核</button>
                            <button type="button" class="layui-btn layui-btn-danger"
                                    @click="delStore(item)">删除</button>
                        </td>
                    </tr>
                    </tbody>
                </table>
                <div style="padding-left: 500px;">
                    <div id="demo50"></div>
                    <ul id="biuuu_city_list5"></ul>
                </div>
            </div>
        </div>
    </div>
</div>
</body>

<script>
    var vueData = new Vue({
        el: '#app',
        data: function() {
            return {
                userInput: '',
                productInfo:'',
                storeInput:'',
                orderInfo:'',
                nowPage: 1,
                selectItem : '',
                unreviewedNum:1,
                isChek:0,
                adminStatus: 0,
                adminName:'admin',
                priceMin:'',
                priceMax:'',
                tableData: [
                    {
                        date: 1,
                        name: '王小虎',
                        address: '上海市普陀区金沙江路 1518 弄'
                    }, {
                        date: 2,
                        name: '王小虎',
                        address: '上海市普陀区金沙江路 1517 弄'
                    }, {
                        date: 3,
                        name: '王小虎',
                        address: '上海市普陀区金沙江路 1519 弄'
                    },
                ],

            }
        },
        created() {
            this.initAdmin()
        },
        methods: {
            updateImg(item){
            },
            loginOut(){
                window.sessionStorage.removeItem("admin")
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/logOut",
                    data: {},
                    type: "post",
                    dataType: "json",
                    success: function(res) {
                        location.reload()
                    }
                })
            },
            initAdmin(){
                var admin = window.sessionStorage.getItem("admin");
                if(admin != null){
                    this.adminStatus = 1;
                    this.adminName = admin
                    this.initUserList()
                }else {
                    alert("请先登录！")
                    this.adminStatus = 0;
                }
            },
            chek(){
                var _this = this;
                this.isChek = 1;
                $.ajax({
                        url: "/taobei_web/admin/getProductListByFlag",
                        data: {
                            "flag":'3'
                        },
                        type: "GET",
                        dataType: "json",
                        success: function(res) {
                            if (res.data == null) {
                                _this.initPage(0,"demo10",1)
                                _this.tableData = []
                            }else {
                                _this.tableData = res.data
                                _this.initPage(res.data.length,"demo10",_this.nowPage)
                            }
                            document.getElementById("num").style = "display:none"
                        }
                })
            },
            updateStoreFlag(item){
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/updateStoreFlag",
                    data: {
                        "id": item.id
                    },
                    type: "post",
                    dataType: "json",
                    success: function(res) {
                        if (res.status != 200) {
                            _this.confirmTrans("更新失败")
                        } else{
                            _this.confirmTrans("更新成功")
                            _this.stayNowPage("queryStoreByFlag?flag=0","demo50",_this.nowPage)
                        }
                    }
                });
            },
            updateProductFlag(item,flag){
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/updateProductFlag",
                    data: {
                        "id": item.id,
                        "flag":flag
                    },
                    type: "post",
                    dataType: "json",
                    success: function(res) {
                        if (res.status == 200) {
                            _this.confirmTrans("更新成功")
                            if(_this.isChek == 0){
                                _this.initProductList("1")
                            }else if(_this.isChek == 1){
                                _this.initProductList("3")
                                _this.chek()
                            }
                        }
                    }
                });
            },
            delStore(item){
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/delStore",
                    data: {
                        "id": item.id
                    },
                    type: "post",
                    dataType: "json",
                    success: function(res) {
                        if (res.status != 200) {
                            _this.confirmTrans("删除失败")
                        } else{
                            _this.confirmTrans("删除成功")
                            _this.stayNowPage("getStoreList","demo50",_this.nowPage)
                        }
                    }
                });
            },
            deleOrder(item){
                if (item.userDelete == 0  && item.storeDelete == 0){
                    var _this = this;
                    $.ajax({
                        url: "/taobei_web/admin/deleOrder",
                        data: {
                            "id": item.id
                        },
                        type: "post",
                        dataType: "json",
                        success: function(res) {
                            if (res.data != 1) {
                                _this.confirmTrans("删除失败")
                            } else{
                                _this.confirmTrans("删除成功")
                                _this.stayNowPage("getOrderList","demo30",_this.nowPage)
                            }
                        }
                    });
                }else {
                    layer.alert('有效订单无法删除！', {icon: 0});
                }

            },
            deleProduct(item,flag){
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/deleteProduct",
                    data: {
                        "id": item.id
                    },
                    type: "post",
                    dataType: "json",
                    success: function (res) {
                        if (res.status == 200) {
                            _this.confirmTrans(res.msg)
                            if(_this.isChek == 0){
                                _this.initProductList("1")
                            }else if(_this.isChek == 1){
                                _this.initProductList("3")
                                _this.chek()
                            }
                        }

                    }
                })
            },
            deleUser(item){
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/deleteUser",
                    data: {
                        "id": item.id
                    },
                    type: "post",
                    dataType: "json",
                    success: function(res) {
                        if (res.data != 1) {
                            _this.confirmTrans("删除失败")
                        } else{
                            _this.confirmTrans("删除成功")
                            _this.stayNowPage("getUserList","demo20",_this.nowPage)
                        }
                    }
                });
            },
            confirmTrans(mas) {
                layui.use('layer', function() {
                    undefined
                    var layer = layui.layer;
                    layer.msg(mas, {
                        time: 2000,
                    });
                });
            },
            dialog(item) {
                var _this = this
                console.log(item.id)
                layer.open({
                    title: '修改用户',
                    shadeClose: true,
                    closeBtn: 1,
                    area: ['500px', '500px'],
                    type: 2,
                    content: 'updateUser.html?id=' + item.id,
                    end: function(index, layero) {
                        _this.stayNowPage("getUserList","demo20",_this.nowPage)
                    }
                });
            },
            stayNowPage(url,demo,nowpage){
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/"+url,
                    async:true,
                    data: {},
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        _this.tableData = res.data
                        console.log(res.data)
                        _this.initPage(res.data.length,demo,nowpage)
                    }
                });
            },
            queryStoreByFlag(flag){
                var _this = this;
                _this.isChek = 1
                $.ajax({
                    url: "/taobei_web/admin/queryStoreByFlag",
                    data: {
                        "flag": flag
                    },
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        _this.tableData = res.data
                        _this.initPage(res.data.length,"demo50",1)
                    }
                });
            },
            queryStore(){
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/getStoreByName",
                    data: {
                        "name": _this.storeInput
                    },
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        _this.tableData = res.data
                        _this.initPage(res.data.length,"demo50",1)
                    }
                });
            },
            queryOrder(){
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/queryOrderByOrderNumber",
                    data: {
                        "orderNumber": _this.orderInfo
                    },
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        _this.tableData = res.data
                        _this.initPage(res.data.length,"demo30",1)
                    }
                });
            },
            queryUser() {
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/queryUsers",
                    data: {
                        "userInfo": _this.userInput
                    },
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        console.log(res.data)
                        _this.tableData = res.data
                        _this.initPage(res.data.length,"demo20",1)
                    }
                });
            },
            updateData(url){
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/"+url,
                    data: {},
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        _this.tableData = res.data
                    }
                });
            },
            queryProduct() {
                this.isChek  = 0;
                var _this = this;
                _this.selectItem = $("select[name='interest']").val();
                console.log(_this.selectItem)
                $.ajax({
                    url: "/taobei_web/admin/queryProductByProductInfo",
                    data: {
                        "Keyword": _this.productInfo,
                        "tid" : _this.selectItem,
                        "minPrice" : _this.priceMin,
                        "maxPrice" : _this.priceMax,
                    },
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        _this.tableData = res.data
                        _this.initPage(res.data.length,"demo10",1)
                    }
                });
            },
            filterDel(arr,delId){
                var arr2 = arr.filter((value,index,a)=>{
                    return value.id != delId;
                })
                return arr2
            },
            initUserList() {
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/getUserList",
                    async:true,
                    data: {},
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        _this.tableData = res.data
                        console.log(res.data)
                        _this.initPage(res.data.length,"demo20",_this.nowPage)
                    }
                });
            },
            initProductList(flag) {
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/getProductListByFlag",
                    data: {
                        "flag":flag
                    },
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        if (console.log(res.data) == null){
                            _this.tableData = res.data
                            _this.initPage(res.data.length,"demo10",1)
                            document.getElementById("num").style = ""
                        }else{
                            _this.tableData = res.data
                            _this.initPage(res.data.length,"demo10",_this.nowPage)
                            document.getElementById("num").style = ""
                        }
                    }
                });
                this.initUnreviewedNum()
                this.initProductType()
            },
            initProductType(){
                $.ajax({
                    url: "/taobei_web/admin/getProductTypeList",
                    data: {},
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        var type =  res.data;
                        var select= document.getElementById('RiverTypeLevel');
                        for (var i=0;i< type.length;i++) {
                            var option = document.createElement("option");
                            option.setAttribute("value", type[i].id);
                            option.innerText = type[i].tname;
                            select.appendChild(option)
                        }
                        layui.use('form', function () {
                            var form = layui.form;
                            form.render("select");
                        });
                    }
                });
            },
            initOrderList() {
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/getOrderList",
                    data: {},
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        _this.tableData = res.data
                        console.log(_this.tableData )
                        _this.initPage(res.data.length,"demo30",1)
                    }
                });
            },
            initUnreviewedNum(){
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/getProductListByFlag",
                    data: {
                        "flag":'3'
                    },
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        if(res.data == null){
                            _this.unreviewedNum = 0
                        }else {
                            _this.unreviewedNum = res.data.length
                            console.log(_this.unreviewedNum)
                        }
                    }
                });
            },
            initStoreList() {
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/getStoreList",
                    data: {},
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        _this.tableData = res.data
                        console.log(res.data)
                        _this.initPage(res.data.length,"demo50",1)
                    }
                });
            },
            initDiscountList(){
                var _this = this;
                $.ajax({
                    url: "/taobei_web/admin/getDiscountList",
                    data: {},
                    type: "GET",
                    dataType: "json",
                    success: function(res) {
                        _this.tableData = res.data
                        console.log(res.data)
                        _this.initPage(res.data.length,"demo40",1)
                    }
                });
            },
            change(key) {
                var id = document.getElementById(key)
                var options = document.getElementsByClassName("option-active")
                for (var i = 0; i < options.length; i++) {
                    options[i].className = "layui-body option"
                }
                id.className = "layui-body option-active";
                switch (key) {
                    case "1-1":
                        this.initUserList()
                        this.nowPage = 1
                        break;
                    case "1-2":
                        this.initProductList("1")
                        this.nowPage = 1
                        break;
                    case "1-3":
                        this.initOrderList()
                        this.nowPage = 1
                        break;
                    case "1-4":
                        this.initDiscountList()
                        this.nowPage = 1
                        break;
                    case "1-5":
                        this.initStoreList()
                        this.nowPage = 1
                        break;
                }

            },
            initPage(size,pageDemo,nowPage) {
                layui.use(['laypage', 'layer'], function() {
                    var laypage = layui.laypage,
                        layer = layui.layer;
                    //将一段数组分页展示

                    //测试数据
                    var data = vueData.tableData;
                    //调用分页
                    laypage.render({
                        elem: pageDemo,
                        count: size,
                        curr:nowPage,
                        limit: 3,
                        jump: function(obj) {
                            //模拟渲染
                            var arr = [],
                                thisData = data.concat().splice(obj.curr * obj.limit - obj
                                    .limit, obj
                                    .limit);
                            vueData.tableData = thisData
                            vueData.nowPage = obj.curr
                            return arr.join('');
                        }
                    });
                })
            },
        }
    })
</script>
<script>
    //JS
    layui.use(['element', 'layer', 'util'], function() {
        var element = layui.element,
            layer = layui.layer,
            util = layui.util,
            $ = layui.$;

        //头部事件
        util.event('lay-header-event', {
            //左侧菜单事件
            menuLeft: function(othis) {
                layer.msg('展开左侧菜单的操作', {
                    icon: 0
                });
            },
        });

    });
</script>
</html>
